<!-- 公共文件 start -->
@extends('admin.public.base')
<!-- 公共文件 end -->

@section('content')
    <div class="layui-fluid">
        <div class="layui-row">
            <form class="layui-form">
                <div class="layui-form-item" style="text-align:center;font-size:18px;">
                    <b>入库订单号：{{$data['order_sn']}}</b>
                    <div class="icon iconfont" style="float:right;">&#xe6c9;</div>
                </div>
                <hr>
                <div class="layui-form-item layui-table-body layui-table-main" style="display: flex;">
                    <div class="layui-col-xs6" style="height:400px; float:left;padding:15px">
                        <b>待选商品</b><br>
                        <table class="layui-table" lay-skin="line" style="table-layout:fixed">
                            <colgroup>
                                <col width="10">
                                <col width="10">
                                <col width="10">
                                <col width="45">
                                <col width="10">
                                <col width="15">
                            </colgroup>
                            <thead>
                            <tr>
                                <th>
                                    <input type="checkbox" lay-filter="checkall-left" name="" lay-skin="primary">
                                </th>
                                <th>分类</th>
                                <th>编号</th>
                                <th>商品名</th>
                                <th>单件价格</th>
                                <th>商品库存</th>
                            </tr>
                            </thead>
                            <tbody class="goodsList1">
                            @foreach( $goodsList as $kk => $item)
                                <tr>
                                    <td onClick="removeDiv(this,{{$kk}},1)"><i class="iconfont" style="color:#1ABC9C">&#xe6b9;</i>
                                    </td>
                                    <td>{{ $item['cate_name'] }}</td>
                                    <td>{{ $item['goods_sn'] }}</td>
                                    <td>{{ $item['goods_name'] }}</td>
                                    <td>{{ $item['goods_price'] }}</td>
                                    <td>{{ $item['goods_sale_num'] }}</td>
                                </tr>
                            @endforeach
                            </tbody>
                        </table>
                    </div>
                    <div class="layui-col-xs6" style="float:right; height:400px; padding:15px">
                        <b>已选商品</b><br>
                        <table class="layui-table" lay-skin="line" style="table-layout:fixed">
                            <colgroup>
                                <col width="10">
                                <col width="10">
                                <col width="10">
                                <col width="45">
                                <col width="10">
                                <col width="15">
                            </colgroup>
                            <thead>
                            <tr>
                                <th>
                                    <input type="checkbox" lay-filter="checkall-left" name="" lay-skin="primary">
                                </th>
                                <th>分类</th>
                                <th>编号</th>
                                <th>商品名</th>
                                <th>单件价格</th>
                                <th>入库数量</th>
                            </tr>
                            </thead>
                            <tbody class="goodsList2">
                            </tbody>
                        </table>
                    </div>
                </div>
                <hr>
                <div class="layui-form-item">
                    <div class="layui-block">
                        <label class="layui-form-label">备注</label>
                        <div class="layui-input-block">
                            <textarea placeholder="请输入内容" class="layui-textarea"
                                      name="remark">{{ $data['remark'] }}</textarea>
                        </div>
                    </div>
                </div>
                <hr>
                <div class="layui-form-item">
                    <label class="layui-form-label"><b>资金信息：</b></label>
                    <div class="layui-input-block" style="line-height:36px">
                        总数量：<b class="zNum">0</b>个<br>
                        总金额：<b class="zMoney">0</b>元<br>
                    </div>
                </div>
                <hr>

                <div class="layui-form-item">
                    <label for="L_repass" class="layui-form-label"></label>
                    <input type="hidden" value="{{$data['order_sn']}}" name="order_sn">
                    <button class="layui-btn" lay-filter="add" lay-submit="">提交</button>
                </div>
            </form>
        </div>
    </div>
    <script type="text/javascript" src="/static/admin/js/xcity.js"></script>
    <script>
        var reDataArr = JSON.parse(HTMLDecode("{{$goodsListStr}}"));
        var goodsIds = [];

        function goodsMake(discount_rate) {
            $('.discount_rate').val(discount_rate);
        }

        function removeDiv(obj, i, type) {
            $(obj).parent().remove();
            // $(".goodsList2").html($(".zNum").html() + 1);
            // $(".zMoney").html($(".zMoney").html() + reDataArr[i].goods_price);
            if (type == 1) {
                var htmlStr = `<tr>
                                <td onClick="removeDiv(this,${i},2)"><i class="iconfont" style="color:#DE1C31">&#xe6fe;</i></td>
                                <td>${reDataArr[i].cate_name}</td>
                                <td>${reDataArr[i].goods_sn}</td>
                                <td>${reDataArr[i].goods_name}</td>
                                <td>${reDataArr[i].goods_price}</td>
                                <td>
<input type="number" name="goods[${reDataArr[i].id}][goods_number]" value="1" min="1" class="layui-input" id="goods_num_${reDataArr[i].id}" onBlur="sumGoodsPrice()">
<input type="hidden" name="goods[${reDataArr[i].id}][goods_id]" value="${reDataArr[i].id}">
<input type="hidden" name="goods[${reDataArr[i].id}][goods_price]" value="${reDataArr[i].goods_price}" >
</td>
                                </tr>`
                $(".goodsList2").prepend(htmlStr);
                goodsIds.push(reDataArr[i]);
            } else {
                var htmlStr = `<tr>
                                <td onClick="removeDiv(this,${i},1)"><i class="iconfont"  style="color:#1ABC9C">&#xe6b9;</i></td>
                                <td>${reDataArr[i].cate_name}</td>
                                <td>${reDataArr[i].goods_sn}</td>
                                <td>${reDataArr[i].goods_name}</td>
                                <td>${reDataArr[i].goods_price}</td>
                                    <td>${reDataArr[i].goods_sale_num}</td>
                                </tr>`;
                $(".goodsList1").append(htmlStr);
                rmGoods(reDataArr[i].id);
            }
            sumGoodsPrice();
            console.log(goodsIds);
        }

        // 删除数据
        function rmGoods(id) {
            for (n = 0; n < goodsIds.length; n++) {
                if (goodsIds[n].id == id) {
                    goodsIds.splice(n, 1);
                }
            }
        }

        // 计算价格
        function sumGoodsPrice() {
            var num = 0;
            var totalNum = 0;
            var money = 0;
            for (n = 0; n < goodsIds.length; n++) {
                num = Number($("#goods_num_" + goodsIds[n].id).val());
                money += Number(goodsIds[n].goods_price) * num;
                totalNum += num;
            }
            console.log(money);
            console.log(goodsIds);
            $(".zMoney").html(money);
            $(".zNum").html(totalNum);
        }

        layui.use(['form', 'layer', 'jquery', 'code'], function () {
            $ = layui.jquery;
            form = layui.form;
            layui.code();
            $('#cityList').xcity();
            form.on("select(college)", function (data) {
                var rate = $("select[name=store_id]").find("option:selected").attr("rate");
                $('.discount_rate').val(rate);
                $.ajax({
                    type: 'POST',
                    url: '/admin/stock/outOrderGoods',
                    data: {store_id: data.value},
                    dataType: 'json',
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
                    },
                    success: function (reData) {
                        console.log(reData);
                        if (reData.code == 1) {
                            var htmlStr = '';
                            reDataArr = reData.data;
                            for (i = 0; i < reData.data.length; i++) {
                                htmlStr += `<tr>
                                <td onClick="removeDiv(this,${i},1)"><i class="iconfont" style="color:#1ABC9C">&#xe6b9;</i></td>
                                <td>${reDataArr[i].cate_name}</td>
                                <td>${reDataArr[i].goods_sn}</td>
                                <td>${reDataArr[i].goods_name}</td>
                                <td>${reDataArr[i].goods_price}</td>
                                    <td>${reDataArr[i].goods_sale_num}</td>
                                </tr>`;
                            }
                            $(".goodsList1").html(htmlStr);
                            $(".goodsList2").html("");
                            $(".zMoney").html(0);
                            $(".zNum").html(0);
                            goodsIds = [];
                        }

                    },
                    error: function (xhr, type) {
                        alert('Ajax error!')
                    }
                });
            });

            //监听提交
            form.on('submit(add)', function (data) {
                if (confirm("你确定生成入库单吗？")) {
                    //发异步，把数据提交给php
                    $.ajax({
                        type: 'POST',
                        url: '/admin/stock/enterOrderAdd',
                        data: data.field,
                        dataType: 'json',
                        headers: {
                            'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
                        },
                        success: function (data) {
                            layer.alert(data.msg)
                            if (data.code == 1) {
                                //关闭当前frame
                                xadmin.close();
                                // 可以对父窗口进行刷新
                                xadmin.father_reload();
                            }
                        },
                        error: function (xhr, type) {
                            alert('Ajax error!')
                        }
                    });
                }
                return false;
            });

        });

        //HTML反转义
        function HTMLDecode(text) {
            var temp = document.createElement("div");
            temp.innerHTML = text;
            var output = temp.innerText || temp.textContent;
            temp = null;
            return output;
        }
    </script>
@endsection
